<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<p>bbb</p>
		<span>aaa</span>
	
		<div>111</div>
		
		<span>222</span>
		<p>3333</p>
		
		<ul>
			<li>111</li>
			<li>222</li>
			<li class="three">333</li>
			<li>444</li>
			<li>555</li>
			<li>666</li>
		</ul>
		
		<script src="jquery.min.js"></script>
		<script>
			console.log($("li:first"));
			
			console.log($("li:last"));
			
		   // 下标从0开始  0 2 4 
			// $("li:even").css("backgroundColor","red")
			// $("li:odd").css("backgroundColor","yellow")
			
			//除了什么什么之外
			//$("li:not(.three)").css("backgroundColor","red");
			
			//eq 下标 等于 3的
			//$("li:eq(3)").css("backgroundColor","red");
			
			// lt 下标小于 3
			//$("li:lt(3)").css("backgroundColor","red");
			
			// gt 下标大于 3
			$("li:gt(3)").css("backgroundColor","red");
			
			
			// console.log($("div+span"));//直接兄弟选择器（后面的兄弟）紧密连接
			// console.log($("div~span"));//间接兄弟选择器（后面的兄弟）
			
			// console.log($("div+p"));//直接兄弟选择器（后面的兄弟）
			// console.log($("div~p"));//间接兄弟选择器（后面的兄弟） 不需要紧密连接
		</script>
	</body>
</html>
